<template>
  <div class="app-container">
    <div class="con">
      <h2>基本信息</h2>
      <el-divider direction="horizontal"/>
      <el-form ref="elForm" :model="form" :rules="rules1" size="medium" label-width="180px" label-position="left">
        <h3>非招标基本信息</h3>
        <el-row type="flex" justify="space-between" align="top" :gutter="15" style="flex-wrap: wrap;">
          <el-form-item label="项目名称" prop="gName" style="width: 45%">
            <el-input v-model="form.gName" clearable class="cInput" v-if="form.gRelease==0"/>
            <el-input v-model="form.gName" clearable class="cInput" v-else readonly/>
          </el-form-item>
          <el-form-item label="项目编号" prop="gCode" style="width: 45%">
            <el-input v-model="form.gCode" clearable class="cInput" readonly/>
          </el-form-item>
          <el-form-item label="采购方式" prop="gTendertype" style="width: 45%">
            <el-input v-model="form.gTendertype" clearable class="cInput" readonly/>
          </el-form-item>
          <el-form-item label="公司" prop="eType" style="width: 45%">
            <el-input v-model="form.gCompany" clearable class="cInput" readonly/>
          </el-form-item>
          <el-form-item label="创建人" prop="createBy" style="width: 45%">
            <el-input v-model="form.createBy" clearable class="cInput" readonly/>
          </el-form-item>
          <el-form-item label="创建部门" prop="createDept" style="width: 45%">
            <el-input v-model="form.createDept" clearable class="cInput" readonly/>
          </el-form-item>
          <el-form-item label="公开/邀请" prop="gIsPublic" style="width: 45%">
            <el-input v-model="form.gIsPublic" clearable class="cInput" readonly/>
          </el-form-item>
          <el-form-item label="报价开始时间" prop="gTimeon" style="width: 45%">
            <el-date-picker v-model="form.gTimeon" type="datetime" placeholder="选择日期时间"
                            v-if="form.gRelease==1||form.gRelease==2" readonly/>
            <el-date-picker v-model="form.gTimeon" type="datetime" placeholder="选择日期时间" v-else/>
          </el-form-item>
          <el-form-item label="报价截止时间" prop="gDeadline" style="width: 45%">
            <el-date-picker v-model="form.gDeadline" type="datetime" placeholder="选择日期时间"
                            v-if="form.gRelease==1||form.gRelease==2" readonly/>
            <el-date-picker v-model="form.gDeadline" type="datetime" placeholder="选择日期时间" v-else/>
          </el-form-item>
        </el-row>
      </el-form>

      <h3>合同标的清单</h3>
      <div class="cl">
        <el-table
          :data="lTableData"
          :row-key="row => row.id"
          @selection-change="lHandleSelectionChange"
          border
          stripe
          :style="{marginTop:'10px'}">
          <el-table-column label="序号" prop="id" width="60"/>
          <el-table-column label="产品名称" prop="inName" width="170">
            <template slot-scope="scope">
              <el-input v-model="scope.row.inName" readonly/>
            </template>
          </el-table-column>
          <el-table-column label="产品编码" prop="tid" width="163">
            <template slot-scope="scope">
              <el-input v-model="scope.row.tid" readonly/>
            </template>
          </el-table-column>
          <el-table-column label="规格型号" prop="inModel">
            <template slot-scope="scope">
              <el-input v-model="scope.row.inModel" readonly/>
            </template>
          </el-table-column>
          <el-table-column label="单位" prop="inUnit" width="120">
            <template slot-scope="scope">
              <el-input v-model="scope.row.inUnit" readonly/>
            </template>
          </el-table-column>
          <el-table-column label="含税单价" prop="inVat" width="130">
            <template slot-scope="scope">
              <el-input v-model="scope.row.inVat" readonly/>
            </template>
          </el-table-column>
          <el-table-column label="数量" prop="inCount" width="150">
            <template slot-scope="scope">
              <el-input v-model="scope.row.inCount" readonly/>
            </template>
          </el-table-column>
          <el-table-column label="小计" prop="inSubtotal" width="140">
            <template slot-scope="scope">
              <el-input v-model="scope.row.inSubtotal" readonly/>
            </template>
          </el-table-column>
        </el-table>
        <div :style="{textAlign:'right'}">
          <span :style="{marginRight:'100px'}">总价:</span>
          <span :style="{fontWeight:'700'}">{{ lTotalSubtotal.toFixed(2) }}</span>
        </div>
      </div>

      <h3 v-if="!show">供应商报价信息</h3>
      <div class="cl" v-if="!show">
        <el-table
          :data="CsQuotation"
          :row-key="row => row.id"
          @selection-change="cHandleSelectionChange"
          border
          stripe
          :style="{marginTop:'10px'}">
          <el-table-column type="selection"/>
          <el-table-column label="序号" type="index" width="80"/>
          <el-table-column label="供应商名称" prop="hName" width="300">
            <template slot-scope="scope">
              <el-input v-model="scope.row.hName" readonly/>
            </template>
          </el-table-column>
          <el-table-column label="报价金额" prop="bjTotal">
            <template slot-scope="scope">
              <el-input v-model="(scope.row.bjTotal).toFixed(2)" readonly/>
            </template>
          </el-table-column>
          <el-table-column label="报价时间" prop="createtime">
            <template slot-scope="scope">
              <el-input v-model="scope.row.createtime" readonly/>
            </template>
          </el-table-column>
        </el-table>
      </div>

      <h3>合同签署文件</h3>
      <el-form ref="elForm1" :model="form" size="medium" label-width="180px" label-position="left">
        <el-row type="flex" justify="space-between" align="top" :gutter="15" style="flex-wrap: wrap;">
          <el-form-item label="附件上传" prop="CsPubAttachments" style="width: 45%">
            <el-upload class="upload-demo"
                       action="#"
                       :http-request="(file) =>  uploadDeviceFile(file,'csPubAttachments')"
                       :drag="true"
                       :before-upload="uploadFileFun"
                       :file-list="this.fileList2"
                       :limit="3"
                       :on-exceed="handleExceed"
                       :on-remove="(file) => handleRemoveFile(file,this.fileList2)"
                       :disabled="form.gRelease == 1">
              <i class="el-icon-upload"></i>
              <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
              <div class="el-upload__tip fontSize12 colorRed" slot="tip">
                上传文件格式为word或pdf或png或者txt，文件大小在10M以内
              </div>
            </el-upload>
          </el-form-item>
        </el-row>
      </el-form>
    </div>

    <div style="margin-top: 20px">
      <el-button size="medium" @click="back1">返回</el-button>
      <el-button size="medium" type="primary" @click="addXy" v-if="show">提交</el-button>
      <el-button size="medium" type="primary" @click="faBu" v-if="form.gRelease==1">完成</el-button>
    </div>
  </div>
</template>

<script>
import {getAttachmentsByAid, getItemsDevice, getPlan, getPro, getQuotation, upePro} from "@/api/system/noTender"
import {listDevice} from "@/api/contract/addContract"
import {removeFile, uplodaBudgetFile} from "@/api/system/purchase"

export default {
  data() {
    return {
      xzCount: null,
      selectedRows: [],
      show: false,
      //业务类型字典数据
      gTenderTypes: [],
      deptDict: [],
      aCode: null,
      //招标项目ID
      gid: this.$route.query.gid,
      //寻源方式
      XyOptions: [{
        value: 1,
        label: '邀请'
      }, {
        value: 2,
        label: '公开'
      }],
      //合同标的表格
      lTableData: [],
      total: 0,
      //产品信息参数
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        tName: null,
        tUnit: null,
        taxRate: null,
        tModel: null,
        tPrice: null,
        tid: null
      },
      //产品集合
      deviceList: [],
      //我方主体选择
      sub: '',
      cpDialog: false,
      lTotalSubtotal: 0,
      lTableColumns: [],
      lSelectedRows: [],
      cgValue: '',
      // 遮罩层
      loading: true,
      // 弹出层标题
      title: '',
      // 是否显示弹出层
      open: false,
      // 表单参数
      form: {
        gName: null,
        gCode: null,
        gIsPublic: null,
        gSpawnTime: null,
        xyId: null,
        gid: null,
        gCompany: null,
        gTendertype: null,
        gTimeon: null,
        gDeadline: null,
        createBy: null,
        createDept: null,
        deptId: null,
        gRelease: null,
        gNotes: null
      },
      // 表单校验
      rules1: {
        gTimeon: [
          {
            required: true,
            message: '请选择报价开始时间',
            trigger: 'blur'
          }
        ],
        gDeadline: [
          {
            required: true,
            message: '请选择报价截止时间',
            trigger: 'blur'
          }
        ]
      },
      selectRow: null,
      fileList2: [],
      //附件
      CsPubAttachments: {
        anSize: null,
        anUrl: null,
        anName: null
      },
      aid: null,
      gfId: null,
      //报价集合
      CsQuotation: [],
      info: {
        gid: null,
        gTimeon: null,
        gDeadline: null,
        gRelease: null,
        csPubAttachments: {
          anId: null,
          aid: null,
          anName: null,
          anUrl: null
        }
      },
      chuan: [],
      show1: false,
      info1: {
        gid: null,
        gRelease: null,
        hid: null
      }
    }
  },
  mounted() {
    this.lCalculateTotalSubtotal();
    this.getList();
  },
  created() {
    this.getDicts('cs_contract_pay').then(res => {
      this.payTypes = res.data;
    });
    this.getDicts("cs_dept").then((res) => {
      this.deptDict = res.data;
    });
  },
  methods: {
    handleExceed(files, fileList) {
      this.$message.warning(`当前限制选择 3 个文件，本次选择了 ${files.length} 个文件，共选择了 ${files.length + fileList.length} 个文件`);
    },
    //删除文件
    handleRemoveFile(file, fileList) {
      removeFile(file.name).then(res => {
        if (res.data == 1) {
          this.$message({
            message: '删除成功',
            type: 'success'
          });
        }
        const index = fileList.findIndex(f => f.name == file.name);
        // 从 fileList 中移除一个元素，从 index 位置开始
        fileList.splice(index, 1);
      })
    },
    //文件上传前的校验
    uploadFileFun(file) {
      var test = /(doc|docx|pdf|txt|png)$/.test(file.name.split('.').pop().toLowerCase());
      if (!test) {
        this.$message.error("请上传正确的文档格式!");
        return false;
      }
      const isLt2M = file.size / 1024 / 1024 < 10;
      if (!isLt2M) {
        this.$message.error("上传文件大小不能超过 10MB!");
        return false;
      }
    },
    uploadDeviceFile(file, str) {
      // 创建formdata实例
      let formData = new window.FormData();
      // 将获取的文件通过append方法加入实例中
      formData.append("file", file.file);
      //发送axios请求
      uplodaBudgetFile(formData)
        .then(res => {
          // 拿到后端响应的文件名称反显到列表的form
          const fileInfo = {
            uid: file.file.uid,
            name: res.data.name,
            size: res.data.size,
            url: res.data.url,
          };
          if (str == 'eImage') {
            this.fileList1.push(fileInfo)
          }
          if (str == 'csPubAttachments') {
            this.fileList2.push(fileInfo)
          }
          if (str == 'eDocuments') {
            this.fileList3.push(fileInfo)
          }
        })
        .catch(err => {
          console.error('上传文件失败:', err);
        });
    },
    //发布项目
    faBu() {
      if (this.CsQuotation.length == 0) {
        this.$message.warning('供应商未报价');
        return false;
      }
      if (this.xzCount !== 1) {
        this.$message.warning('请选择单个供应商！');
      } else {
        this.info1.gid = this.gid;
        this.info1.gRelease = 2;
        this.info1.hid = this.selectedRows[0].hid;
        console.log(this.CsQuotation[0].hid, 'this.CsQuotation[0].hid');
        upePro(this.info1).then((res) => {
          this.$message.success(res.msg);
          this.$router.push('index');
        }).catch((error) => {
          this.$message.error('发布失败');
        });
      }
    },
    //创建合同
    addXy() {
      this.$refs.elForm.validate(valid => {
          if (valid) {
            // 获取当前时间
            let currentTime = new Date();
            // 获取报价开始时间和截止时间
            let startTime = new Date(this.form.gTimeon);
            let deadline = new Date(this.form.gDeadline);
            // 验证时间是否大于当前时间
            if (startTime < currentTime || deadline < currentTime) {
              this.$message.error('报价开始时间和截止时间不能小于当前时间');
            } else {
              // 时间验证通过，继续验证时间间隔和文件上传
              let timeDiff = Math.abs(deadline.getTime() - startTime.getTime());
              // 计算相差的小时数
              let diffHours = timeDiff / (1000 * 3600);
              if (diffHours < 24) {
                this.$message.error('报价开始时间和截止时间的间隔不能小于24小时');
              } else {
                // 时间间隔验证通过，继续验证文件上传
                if (this.fileList2.length == 0) {
                  this.$message.warning('请上传附件');
                } else {
                  console.log(1);
                  this.chuan.push(...this.fileList2);
                }
              }
            }
          } else {
            this.$message.error('请填写完整信息');
            return false;
          }
        }
      )
    },
    //转换日期
    convertAndFormatDate(originalDate) {
      const dateObj = new Date(originalDate);
      const formattedDate = dateObj.toLocaleString('en-US', {
        year: 'numeric',
        month: '2-digit',
        day: '2-digit',
        hour: '2-digit',
        minute: '2-digit',
        second: '2-digit'
      });
      return formattedDate.replace(/(\d+)\/(\d+)\/(\d+), (\d+):(\d+):(\d+) (AM|PM)/, function (match, month, day, year, hours, minutes, seconds, ampm) {
        const hours24 = (ampm == 'PM' && hours < 12) ? parseInt(hours, 10) + 12 : hours;
        return `${year}-${month}-${day} ${hours24}:${minutes}:${seconds}`;
      });
    },
    add() {
      this.info.gTimeon = this.convertAndFormatDate(this.form.gTimeon);
      this.info.gDeadline = this.convertAndFormatDate(this.form.gDeadline);
      this.info.gRelease = 1;
      console.log(this.chuan, 'chuan');
      this.info.csPubAttachments.anUrl =
        this.chuan.map(item => item.response ? item.response.data.url : item.url).join(',');
      this.info.csPubAttachments.anName =
        this.chuan.map(item => item.response ? item.response.data.name : item.name).join(',');
      console.log(this.info.csPubAttachments.anUrl, 'this.info.csPubAttachments.anUrl');
      console.log(this.info.csPubAttachments.anName, 'this.info.csPubAttachments.anName');
      upePro(this.info).then((res) => {
        this.$message.success('发布成功');
        this.$router.push('index');
      }).catch((error) => {
        this.$message.error('发布失败');
      });
    },
    //查询采购计划信息
    getList() {
      getPro(this.gid).then(response => {
        this.aid = response.data.xyId;
        this.info.csPubAttachments.aCode = response.data.xyId;
        this.info.gid = response.data.gid;
        this.form = response.data;
        if (response.data.gRelease == 0) {
          this.show = true;
        }
        if (response.data.gTendertype == 3) {
          this.form.gTendertype = '询价';
        } else if (response.data.gTendertype == 5) {
          this.form.gTendertype = '竞争性谈判';
        } else if (response.data.gTendertype == 4) {
          this.form.gTendertype = '委托';
        } else if (response.data.gTendertype == 6) {
          this.form.gTendertype = '单一来源';
        }
        if (response.data.gIsPublic == 1) {
          this.form.gIsPublic = '公开';
        } else {
          this.form.gIsPublic = '邀请';
        }
        this.form.gCompany = '成顺科技有限公司';
        this.gfId = this.form.gCode;
        this.getComPubAttachments();
        return Promise.all([getPlan(this.aid), getQuotation({gfId: this.gfId})]);
      }).then(res => {
        this.form.createBy = res[0].data.createBy;
        this.form.deptId = res[0].data.deptId;
        this.form.createDept = this.deptDict.find(item => item.dictValue == this.form.deptId).dictLabel;
        res[1].rows.forEach(row => {
          let quo = {
            hid: row.bjHid,
            hName: row.csSupplier.hName,
            bjSecond: row.bjSecond,
            bjTotal: row.bjTotal,
            createtime: row.createtime
          }
          this.CsQuotation.push(quo);
        });
        //查询产品信息
        return getItemsDevice({aid: this.aid});
      }).then(res => {
        res.rows.forEach((e, i) => {
          this.lTableData.push({
            id: i + 1,
            inName: e.csDevice.tName,
            inModel: e.csDevice.tModel,
            inVat: (e.csDevice.tPrice * 1.13).toFixed(2),
            inUnit: e.csDevice.tUnit,
            inSubtotal: (e.vCount * e.csDevice.tPrice * 1.13).toFixed(2),
            tid: e.tid,
            inCount: e.vCount
          });
          this.lTotalSubtotal += e.vCount * e.csDevice.tPrice * 1.13.toFixed(2);
        })
      })
    },
    //查询附件信息
    getComPubAttachments() {
      getAttachmentsByAid(this.aid).then(res => {
        console.log(res, 'res');
        if (!res.data) {
          return;
        }
        this.info.csPubAttachments.anId = res.data.anId;
        if (res.data.anName && res.data.anUrl) {
          const names = res.data.anName.split(',');
          const urls = res.data.anUrl.split(',');
          let fileList = [];
          for (let i = 0; i < names.length; i++) {
            fileList.push({
              name: names[i],
              url: urls[i]
            });
          }
          this.fileList2 = fileList;
          this.info.csPubAttachments.anName = res.data.anName;
          this.info.csPubAttachments.anUrl = res.data.anUrl;
        } else {
          this.fileList2 = [];
          this.info.csPubAttachments.anName = null;
          this.info.csPubAttachments.anUrl = null;
        }
      })
    },
    spCountBlur(row) {
      if (row.inVat == null) {
        row.inVat = 0.00;
      }
      row.inSubtotal = (row.inCount * row.inVat).toFixed(2);
      this.lCalculateTotalSubtotal();
    }
    ,
    //产品数量输入框的值改变时
    spCountChange(row) {
      if (row.inVat == null) {
        row.inVat = 0.00;
      }
      row.inSubtotal = (row.inCount * row.inVat).toFixed(2);
      this.lCalculateTotalSubtotal();
    }
    ,
    // 计算产品总价格方法
    lCalculateTotalSubtotal() {
      this.lTotalSubtotal = this.lTableData.reduce((total, row) => {
        let totalValue = row.inSubtotal ? parseFloat(row.inSubtotal) : 0;
        // 将每行的小计相加得到总价格
        let kk = total + totalValue;
        this.form.eAmount = kk.toFixed(2);
        this.qsFormData.gnPbamount = kk.toFixed(2);
        return kk;
      }, 0);
    },
    //查询产品信息
    selectBdList() {
      listDevice(this.queryParams).then(response => {
        this.deviceList = response.rows;
        this.total = response.total;
      });
    },
    //查询供应商信息和业务经办人信息
    selectSupplier() {
      /* 业务经办人信息 */
      getOperator(this.hid).then(response => {
        console.log(response);
        let k = response.data;
        this.qsFormData.gnPbcontact = k.ywName;
        this.qsFormData.gnPbcif = k.ywPhone;
      })
      /* 供应商信息 */
      getSupplier(this.hid).then(res => {
        console.log('打印了供应商的信息');
        console.log(res);
        let k = res.data;
        this.qsFormData.gnPbname = k.hName;
        this.qsFormData.gnPbaddress = k.hAddress;
        this.qsFormData.gnPbbank = k.hBankAddress;
        this.qsFormData.gnPbaccount = k.hAccount;
        this.qsFormData.gnPbid = k.hid;
        this.form.hid = k.hid;
      });
    },
    //产品行点击事件
    handleRowClick(row) {
      // 在这里处理行点击事件
      this.selectRow.inName = row.tName;
      this.selectRow.tid = row.tid;
      this.selectRow.inModel = row.tModel;
      this.selectRow.inUnit = row.tUnit;
      this.selectRow.tid = row.tid;
      this.selectRow.inVat = (row.tPrice * 1.13).toFixed(2);
      this.selectRow.inCount = 1;
      this.selectRow.inSubtotal = (this.selectRow.inCount * this.selectRow.inVat).toFixed(2);
      this.cpDialog = false;
      this.lCalculateTotalSubtotal();
    },
    //产品行点击事件
    handleRowClick1(row) {
      // 在这里处理行点击事件
      this.selectRow.hName = row.hName;
      this.selectRow.tid = row.tid;
      this.GysDialog = false;
    },
    //关闭产品名称对话框
    closeDialog1() {
      this.cpDialog = false;
    },
    //显示产品对话框
    openCp(row) {
      this.selectRow = row;
      this.cpDialog = true;
      this.selectBdList();
    },
    //返回
    back1() {
      this.$router.push('index');
    },
    //单选多选
    lHandleSelectionChange(selection) {
      this.lSelectedRows = selection;
    },
    //供应商单选多选
    cHandleSelectionChange(selection) {
      this.selectedRows = selection;
      this.xzCount = selection.length;
    }
  }
}
</script>

<style scoped>
.cl >>> .el-input__inner {
  border: none;
}

.cInput {
  width: 100%;
}

/*穿透隐藏el-input边框
.app-container>>>.el-input__inner {
}*/
.app-container {
  background-color: rgb(243, 243, 243);
}

.title {
  text-align: center;
}

.con {
  background-color: white;
  padding: 15px 80px 20px 80px;
  border: 1px solid #ececec;
}

h3 {
  font-weight: bold;
}

h2 {
  text-align: center;
  margin: 30px 0px;
}

</style>
